import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Storage } from '@ionic/storage';//数据存储
import { HttpClient } from "@angular/common/http";//服务
import { LoadingController } from 'ionic-angular';//加载框
import { ToastController } from 'ionic-angular';//提示框
import { SettingPage } from '../setting/setting';
import { NavParams } from 'ionic-angular';
import * as $ from 'jquery';
@Component({
    selector: 'page-home',
    templateUrl: 'home.html'
})
export class HomePage {
    province: string;
    city: string;
    district: string;
    today: string;//日期
    degree: string;//实时温度;
    tem_day: string;//最高气温
    tem_night: string;//最低气温
    wind_direction: string;//风向
    wind_power: string;//风力
    aq: string;//空气质量
    update_time: string;//更新时间
    weather: string;//天气
    weather_code: string;//天气图片
    forecast_1h: any;//逐时预报
    forecast_24h_left: any;//七天预报
    forecast_24h_right: any;//七天预报
    theme: string;//主题
    loading: any;//加载框
    isCollection: boolean;
    collectionArray: any;
    constructor(public navCtrl: NavController, public http: HttpClient, public loadingCtrl: LoadingController, private storage: Storage, private toastCtrl: ToastController, public params: NavParams) {
        this.weather_code = '../../assets/imgs/weather_icon/晴.svg';
        this.storage.get('collection').then((val) => {
           
            if(val&&!this.params.get('city')){
                this.getWeather(val[0]);
            }
            if(val&&this.params.get('city')){
                this.getWeather(this.params.get('city'));
            }
            if(!val&&this.params.get('city')){
                this.getWeather(this.params.get('city'));
            }
            if(!val&&!this.params.get('city')){
                this.getWeather('郑州');
            }
        })
    }
    ionViewWillEnter() {
        this.storage.get('collection').then((val) => {
           val? this.collectionArray=val:this.collectionArray=null,this.isCollection=false;
        })
        this.storage.get('theme').then((val) => {
            if (val) {
                this.theme = val.th ? val.th : 'background_two';
            } else {
                this.theme = 'background_two';
            }
        });
    }
    ionViewDidLoad() {
        setTimeout(function () {
            $('.forecast_1h').animate({
                height: '37vh'
            }, 2000);
            $('.line').animate({
                height: '39vh'
            }, 2000)
        }, 500)
        setTimeout(function () {
            $('.update_time').fadeOut();
        }, 5000)
    }
    getWeather(city) {
        this.loading =  this.loadingCtrl.create({
            content: '正在获取天气信息',
            duration: 10000
        });
        this.loading.present();
        this.http.get('http://api.shujuzhihui.cn/api/weather/area?appKey=51e6275bab064c25b6b2af4ab436fb56&n7=1&area=' + city)
        .subscribe(date => {
            if (date && date['ERRORCODE'] == 0) {
                this.city = city;
                this.storage.get('collection').then((val) => {
                    if(val){
                        for (var i = 0; i < val.length; i++) {
                            if (this.city == val[i]) {
                                this.isCollection = true;
                                break;
                            }
                        }
                    }else{
                        this.isCollection = false;
                    }
                 })
                var dates = date['RESULT']['weatherInfo'];
                this.update_time = dates['real']['publish_time'];
                this.today = dates['today']['date'];
                this.degree = dates['real']['tem'];
                this.weather = dates['real']['weather'];
                this.weather_code = '../../assets/imgs/weather_icon/' + dates['real']['weather'] + '.svg';
                this.tem_day = dates['today']['tem_day'];
                this.tem_night = dates['today']['tem_night'];
                this.wind_direction = dates['real']['swdd'];
                this.wind_power = dates['real']['wdp'];
                this.aq = dates['real']['aq'];
                this.forecast_1h = dates['h3'];
                this.forecast_24h_left = [dates['n7']['d2'], dates['n7']['d3'], dates['n7']['d4']];
                this.forecast_24h_right = [dates['n7']['d5'], dates['n7']['d6'], dates['n7']['d7']];
                this.tishikuang('天气信息获取成功')
                this.loading.dismiss();
            }else{
                this.tishikuang('天气信息获取失败')
            }
        }, err => {
            this.tishikuang('天气信息获取失败')
        })
    }
    openTips(id) {
        $('#' + id).remove()
        $('.cover').stop().fadeIn('500');
        $('.tips').addClass('shows')
    }
    closeTips(id) {
        $('.cover').stop().fadeOut('500')
        $('#' + id).removeClass('shows')
    }
    tishikuang(str) {//提示框
        let toast = this.toastCtrl.create({
            message: str,
            duration: 2000,
            position: 'top'
        });
        toast.present();
    }
    goSetting() {
        this.navCtrl.push(SettingPage);
    }
    Addcollection(city) {
        var arrays = new Array();
        arrays.push(city);
        this.storage.get('collection').then((val) => {
            if (val) {
                arrays = arrays.concat(val)
                this.storage.set('collection', arrays).then(() => {
                    this.isCollection = true
                    this.tishikuang('收藏' + city + '成功');
                    this.storage.get('collection').then((vals) => {
                        vals ? this.collectionArray = vals : this.collectionArray = null;
                    })
                });
            } else {
                this.storage.set('collection', arrays).then(() => {
                    this.isCollection = true
                    this.tishikuang('收藏' + city + '成功');
                    this.storage.get('collection').then((vals) => {
                        vals ? this.collectionArray = vals : this.collectionArray = null;
                    })
                });
            }
        })
    }
    Removecollection(city) {
        this.storage.get('collection').then((val) => {
            for (var i = 0; i < val.length; i++) {
                if (city == val[i]) {
                    var part1 = val.slice(0, i + 1);
                    var part2 = val.slice(i + 1);
                    part1.pop();
                    this.storage.set('collection', part1.concat(part2)).then(() => {
                        this.isCollection = false;
                        this.tishikuang('取消收藏' + city + '成功')
                    });
                }
            }
        })
    }
    SwitchCity(e: any) {
        e.stopPropagation();
        $('.switch').show();
    }
    HideSwitchs() {
        $('.switch').hide();
    }
}
